<template>
    <!-- 动画效果保留两位,(0)表示整数 -->
    {{d.num.toFixed(0)}}
</template>
<script setup>
import {reactive, watch} from 'vue'
import gsap from 'gsap'

const props = defineProps({
    value:{
        type:Number,
        default:0,
    }
})
const d = reactive({
    num:0 //数值为0
})

function AnimateToValue(){
    gsap.to(d,{
        duration:0.5,//0.5秒动画
        num:props.value //加载成原来的值
    })
}
AnimateToValue()
//监听事件
watch(()=>props.value,()=> AnimateToValue() )
</script>